<template>
	<view class="heade">
		<!-- <MyNav title="我的" bgColor="" :backIcon="false"></MyNav> -->
		<view class="headTop">
			我的
		</view>
		<view v-if="userInfo.captainPhone">
			<view class="heade_top">
				<view class="heade_left" @click="onLoginout">
					<image src="../../../static/icon_person.png" mode="" class="heade_img"></image>
				</view>
				<view class="heade_right">
					<!-- <view class="heade_corporate">{{userInfo.etpName}}</view> -->
					<view class="heade_name">{{userInfo.captainName || '用户名'}}<image v-if="shipInfo.captainStatus !== '0'" style="width: 38rpx;height: 33rpx;margin-top: 5rpx; margin-left: 10rpx;"
								mode="aspectFit" src="../../../static/icon_certification.png"></image></view>
					<view class="heade_phone">{{userInfo.captainPhone}}</view>
					<!-- <view class="heade_num">账户余额：{{balance == '' ? 0 :balance}}（元）</view>
					<view class="detail" @click="ondetailed()">
						明细
					</view> -->
				</view>
				
			</view>
			<view class="row-css" style="padding: 20rpx;align-items: center;">
				<view class="line"></view>
				<view>船舶信息</view>
			</view>
			<view class="row-css" style="padding: 40rpx 0;flex-wrap: wrap;">
				<uni-badge style="text-align: center;width: 33.3%;margin-bottom: 40rpx;" :text="shipInfo.realNameStatus === '0' ? 1 : 0" :is-dot="true" absolute="rightTop">
					<view @click="oninformation(3)">
						<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/personal_information.png">
						</image>
						<view>个人信息</view>
					</view>
				</uni-badge>
				
				<view style="text-align: center;width: 33.3%;" @click="oninformation(5)">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/waybill_information.png">
					</image>
					<view>我的运单</view>
				</view>
				<!-- <view style="text-align: center;width: 33.3%;"  @click="onwithdraw(paylist)">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/personal_information.png">
					</image>
					<view>我要提现</view>
				</view>
				<view style="text-align: center;width: 33.3%;" @click="oninformation(1)">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/vehicle_information.png">
					</image>
					<view>银行卡</view>
				</view> -->
				<view style="text-align: center;width: 33.3%;" @click="oninformation(2)">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/signing_information.png">
					</image>
					<view>签约中心</view>
				</view>
				<view style="text-align: center;width: 33.3%;" @click="oninformation(4)">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/billing_message.png">
					</image>
					<view>收款信息</view>
				</view>
				<view style="text-align: center;width: 33.3%;" @click="oninformation(6)">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/entrustedpayee.png">
					</image>
					<view>委托收款人</view>
				</view>
				<!-- <view style="text-align: center;width: 33.3%;" @click="callPhone">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/personal_phone.png">
					</image>
					<view>客服热线</view>
				</view> -->
				<view style="text-align: center;width: 33.3%;" @click="help">
					<image style="width: 66rpx;height: 66rpx;" mode="aspectFit" src="../../../static/personal_help.png">
					</image>
					<view>帮助中心</view>
				</view>
			</view>
		</view>

		<view v-else class="column-css"
			style="justify-content: center;text-align: center;height: 100vh;background: #FFFFFF;">
			<view style="margin: 0 150rpx;" @click="onLogin()"><button style="background: #007AFF;" type="primary">注册 /
					登录</button></view>
			<view style="font-size: 28rpx;padding: 40rpx;">请先登录再查看我的信息</view>
		</view>
		
		<callPhoneModal :show="callPhoneModalShow" @close="callPhoneModalShow = false"></callPhoneModal>

	<s-tabbar path="/pages/ship/index/mine"></s-tabbar>
	</view>
</template>

<script>
	// import MyNav from "@/components/myNav.vue"
	import sTabbar from '@/components/s-tabbar/s-tabbar.vue';
	import callPhoneModal from "@/components/callPhoneModal/callPhoneModal.vue"
	export default {
		components: {
			// MyNav
			sTabbar,
			callPhoneModal
		},
		data() {
			return {
				balance: "",
				userInfo: {}, //
				// mobile: uni.getStorageSync(this.DATA_KEY.userInfo).mobile,
				bankIcon: null,
				paylist: '',
				isShow: false,
				shipInfo: {},
				
				callPhoneModalShow: false
			}
		},
		onLoad() {
			uni.hideTabBar()
			this.userInfo = uni.getStorageSync(this.DATA_KEY.userInfo);
			// if (this.userInfo.captainPhone != null && this.userInfo.captainPhone != '') {
			// 	this.getShipInfo();
			// 	this.inIf() //获取余额信息
			// }
			
			// this.onbilllist();
		},
		onShow() {
			// this.onbilllist();
			this.userInfo = uni.getStorageSync(this.DATA_KEY.userInfo);
			if (this.userInfo.captainPhone != null && this.userInfo.captainPhone != '') {
				this.getShipInfo();
			}
		},
		methods: {
			onLogin() {
				uni.redirectTo({
					url: '/pages/personal/login'
				})
			},
			inIf() {
				this.wxRequest({
					url: `${this.API}/mini/jzb/queryBalanceCaptain`,
					method: 'POST',
					title: '余额查询中...',
					success: res => {
						let num = (res.data.data.availAmount - res.data.data.payFreeze).toFixed(2)
						this.balance = num > 0 ? num : 0
					}
				})
			},
			onwithdraw(item) {
				uni.navigateTo({
					url: '/pages/home/withdrawal?num=' + this.balance
				})
			},
			onShipp() {
				uni.navigateTo({
					url: '/pages/home/increase'
				})
			},
			onbilllist() {
				let driverId = uni.getStorageSync(this.DATA_KEY.userInfo).driverId;
				uni.request({
					url: `${this.API}/mini/jzb/queryBindBankCardCaptain`,
					method: 'POST',
					title: '加载中...',
					header: {
						'Content-Type': 'multipart/form-data;boundary=ebf9f03029db4c2799ae16b5428b06bds',
						'authorization': uni.getStorageSync(this.DATA_KEY.token)
					},
					success: res => {
						if (res.data.code == 0) {
							if (res.data.data.length != 0) {
								this.paylist = res.data.data[0];
							} else {
								this.isShow = true
							}

						} else {
							this.isShow = true
						}
					}
				});
			},
			formatBank(bank) {
				return bank.replace(/[\s]/g, 'string').replace(/(\d{4})(?=\d)/g, "$1 ")
			},
			onLoginout() {
				let that = this;
				// #ifdef MP-WEIXIN
				if (that.userInfo.captainPhone) {
					uni.showModal({
						title: '提示',
						content: '是否退出登录?',
						success: function(res) {
							if (res.confirm) {
								that.wxRequest({
									url: `${that.API}/miniApp/auth/wxLogoutCaptain`,
									method: 'POST',
									title: '加载中...',
									success: res => {
										uni.setStorageSync(that.DATA_KEY.userInfo, '');
										uni.setStorageSync(that.DATA_KEY.token, '');
										uni.setStorageSync(that.DATA_KEY.etpId, '');
										uni.setStorageSync(that.DATA_KEY.etpName, '');
										uni.setStorageSync(that.DATA_KEY.oldTime, '');
										uni.setStorageSync(that.DATA_KEY.loadingOrderId, '');
										uni.removeStorageSync('loginType');
										uni.switchTab({
											url: '/pages/index/taskhome'
										});
									}
								})
								console.log('确定');
							} else if (res.cancel) {
								console.log('取消');
							}
						}
					});
				}
				// #endif
				// #ifdef APP-PLUS
				if (that.userInfo.captainPhone) {
				  uni.navigateTo({
				  	url:'/pages/personal/setup'
				  })
				  }
				// #endif
			},
			ondetailed() {
				uni.navigateTo({
					url: '/pages/home/billway'
				})
			},
			oninformation(val){
				if(val == 2){
					uni.navigateTo({
						url: '/pages/home/signinglist'
					})
				}
				if (this.shipInfo.platformDriverLiveStatus === '0' && this.shipInfo.captainStatus === '0' && val != 6) {
					uni.navigateTo({
						url: '/pages/ship/user/infoSet'
					})
					return
				} 
				if (val == 3) {
					
					if (this.shipInfo.platformDriverLiveStatus === '0' && this.shipInfo.captainStatus === '0') {
						uni.navigateTo({
							url: '/pages/ship/user/infoSet'
						})
					} else {
						uni.navigateTo({
							url: '/pages/ship/user/info'
						})
					} 
				} else if (val == 4) {
					uni.navigateTo({
						url:'/pages/ship/user/billingmessage'
					})
				} else if (val == 5) {
					uni.reLaunch({
						url: '/pages/ship/index/task'
					})
				} else if (val == 6) {
					if (this.shipInfo.shippingPayInfoStatus === '0') {
						// 不是委托收款人
						uni.navigateTo({
							url: '/pages/ship/user/openpayeewallet?pay=1'
						})
					} else {
						if (this.shipInfo.platformDriverLiveStatus === '0' && this.shipInfo.captainStatus === '0') {
							// 是委托收款人未实名
							uni.navigateTo({
								url: '/pages/ship/user/infoSet?pay=1&payAuth=1'
							})
						} else if (this.shipInfo.platformDriverLiveStatus === '0' && this.shipInfo.captainStatus === '1') {
							uni.navigateTo({
								url: '/pages/ship/user/delegatedPavee'
							})
						} else {
							uni.navigateTo({
								url: '/pages/ship/user/billingmessage'
							})
						}
					}
					// if (this.shipInfo.shippingPayInfoStatus === '0' && this.shipInfo.platformDriverLiveStatus === '0') {
					// 	uni.navigateTo({
					// 		url: '/pages/ship/user/openpayeewallet?pay=1'
					// 	})
					// } else if (this.shipInfo.shippingPayInfoStatus === '0') {
					// 	uni.navigateTo({
					// 		url: '/pages/ship/user/openpayeewallet?pay=1'
					// 	})
					// } else if (this.shipInfo.platformDriverLiveStatus === '0') {
					// 	uni.navigateTo({
					// 		url: '/pages/ship/user/delegatedPavee'
					// 	})
					// } else {
					// 	uni.navigateTo({
					// 		url: '/pages/ship/user/billingmessage'
					// 	})
					// }
					
				}
				
			},
			getShipInfo() {
				this.wxRequest({
					url: `${this.API}/captainApp/captainAuthentication?etpId=${uni.getStorageSync(this.DATA_KEY.etpId)}`,
					method: 'GET',
					success: res => {
						if (res.data.code == 0) {
							this.shipInfo = res.data.data
							this.userInfo = res.data.data.captain
							uni.setStorageSync(this.DATA_KEY.userInfo, res.data.data.captain);
							if (
								res.data.data.captain.etpId != '' &&
								res.data.data.captain.etpName != '' &&
								!uni.getStorageSync(this.DATA_KEY.etpId) &&
								!uni.getStorageSync(this.DATA_KEY.etpName)
							) {
								uni.setStorageSync(this.DATA_KEY.etpId, res.data.data.captain.etpId);
								uni.setStorageSync(this.DATA_KEY.etpName, res.data.data.captain.etpName);
							} else if (res.data.data.captain.etpId == '' && res.data.data.captain
								.etpName == '') {
								uni.setStorageSync(this.DATA_KEY.etpId, '');
								uni.setStorageSync(this.DATA_KEY.etpName, '');
							}
						}
					}
				});
			},
			
			// 客服电话
			callPhone() {
				this.callPhoneModalShow = true
			},
			help() {
				uni.navigateTo({
					url: "/pages/service/help"
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #FFFFFF;
	}
	.headTop{
		margin-top: 40rpx;
		line-height: 100rpx;
		padding-left: 30rpx;
	}
	.heade_top {
		background-color: #DFEAFC;
		display: flex;
		padding: 80rpx 40rpx 60rpx;
	}

	.heade_left {
		width: 200rpx;
		height: 200rpx;
	}

	.heade_img {
		width: 100%;
		height: 100%;
		border-radius: 100px;
	}

	.heade_right {
		width: 70%;
		margin: 20rpx;
		color: #4373fa;
	}

	.heade_corporate {
		font-size: 30rpx;
	}

	.heade_name {
		font-size: 28rpx;
		margin: 15rpx 0;
		display: flex;
		align-items: center;
	}

	.heade_phone {
		font-size: 26rpx;
		margin: 15rpx 0;
	}

	.heade_num {
		font-size: 30rpx;
	}

	.heade_conte {
		margin: 15rpx;
		background-color: #ffffff;
		border-radius: 20rpx;
	}

	.conten {
		display: flex;
		justify-content: center;
		padding: 10rpx;
	}

	.conten_title {
		margin: 10rpx 15rpx;
		line-height: 30rpx;
		font-size: 32rpx;
		font-weight: 500;
		color: #cfcfcf;
	}

	.card-info {
		margin: 24rpx 0;
		padding: 24rpx;
		color: #000;
		box-shadow: 0 0 20rpx 8rpx rgba(0, 0, 0, 0.04);
		border-radius: 8rpx;
	}

	.flex {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	image {
		width: 70rpx;
		height: 70rpx;
	}

	.text-info {
		flex: 1;
		margin: 0 24rpx;
	}

	.name {
		font-size: 28rpx;
	}

	.type {
		font-size: 22rpx;
		margin-top: 4rpx;
	}

	.btn {
		color: #8C614B;
		padding: 12rpx 48rpx;
		font-size: 32rpx;
		background: #FFFFFF;
		box-shadow: 0 0 20rpx 0 rgba(140, 97, 75, 0.16);
		border-radius: 34rpx;
	}

	.number {
		font-size: 44rpx;
		font-weight: 500;
		margin-top: 24rpx;
	}

	.item {
		position: relative;
		z-index: 2;
		margin-bottom: 30rpx;
	}

	.card {
		color: #333;
		margin-left: 36rpx;
		position: relative;
		z-index: 2;
	}

	.text {
		font-size: 30rpx;
		line-height: 44rpx;
	}

	.number {
		font-size: 44rpx;
		font-weight: 500;
	}

	.datbtn {
		display: flex;
	}
	.row-css {
		display: flex;
		flex-direction: row;
	}
	
	.column-css {
		display: flex;
		flex-direction: column;
	}
	.detail{
		/* position: absolute;
		right: 20rpx;
		top: 400rpx; */
		float: right;
		color: #4373fa;
		border-bottom: 2rpx solid #4373fa;
	}
</style>